<template>
	<view class="address-list">
		<view class="rf-list" v-if="addressList.length > 0">
			<view class="rf-list-item" v-for="(item, index) in addressList" :key="index">
				<view class="mid" @longtap="deleteAddress(item.beforeUserId)">
					<view class="address-box">
						<text v-if="parseInt(item.isDefault, 10) === 1" class="tag"
							:class="'text-' + themeColor.name">默认</text>
						<text class="address in1line">{{ item.addres }}</text>
					</view>
					<view class="u-box">
						<text class="name">{{ item.customerUserName }}</text>
						<text class="mobile">{{ item.shippingPhone }}</text>
					</view>
				</view>
				<view class="right">
					<text class="iconfont iconbianji" @click="modification(item)"></text>
				</view>
			</view>
			<text v-if="addressList.length > 0" class="tips" :class="'text-' + themeColor.name">
				提示：长按可删除当前收货地址。最多只能存在一个默认地址。
			</text>
			<rf-load-more v-if="addressList.length > 0" :status="loadingType" />
		</view>
		<view class="add-btn-wrapper">
			<button class="add-btn" :class="'bg-' + themeColor.name" @tap="addAddress('add')">新增地址</button>
		</view>
		<rf-empty :info="`暂无收货地址，请添加地址`" v-if="addressList.length === 0 && !loading"></rf-empty>
		<!--加载动画-->
		<rfLoading isFullScreen :active="loading"></rfLoading>
	</view>
</template>
<script>
	/**
	 * @des 收货地址列表
	 *
	 * @author stav stavyan@qq.com
	 * @date 2020-03-10 18:00
	 * @copyright 2019
	 */
	import {
		addressDelete,
		addressList
	} from '@/api/userInfo';
	import rfLoadMore from '@/components/rf-load-more/rf-load-more';
	export default {
		components: {
			rfLoadMore
		},
		data() {
			return {
				timeOutEvent: 0,
				source: 0,
				page: 1,
				loadingType: 'more',
				addressList: [],
				loading: false,
				beforeUserId:'',
			};
		},
		onLoad() {
			uni.getStorage({
				key:'beforeUser',
				success: (res) => {
					this.beforeUserId = res.data.beforeUserId
				}
			})
			this.TowListAdd()
		},
		methods: {
			modification(item){
				console.log(item)
				const aitem = encodeURIComponent(JSON.stringify(item))
				uni.navigateTo({
				    url: '/pages/user/address/modification?to='+aitem
				});
			},
			addAddress(type, id) {
				this.$mRouter.push({
					route: `/pages/user/address/manage?type=${type}&id=${id}`
				});
			},
			TowListAdd(){
				uni.request({
					url: 'http://localhost:9090/before/bgs/customer-addr/TowListAdd', 
					data: {
						beforeUserId: this.beforeUserId
					},
					method: 'Get',
					success: (res) => {		
						this.addressList = res.data.data.list
						this.loadingType = false
					}
				});
			}
		}
	};
</script>
<style lang="scss">
	page {
		background-color: $page-color-base;
	}

	.address-list {
		position: relative;

		.address-box {
			display: flex;
			align-items: center;

			.tag {
				font-size: 24upx;
				margin-right: 4upx;
				border: 1px solid;
				border-radius: 4upx;
				padding: 0 4upx;
			}

			.address {
				font-size: 30upx;
				color: $font-color-dark;
			}
		}

		.u-box {
			font-size: 28upx;
			color: $font-color-light;
			margin-top: 16upx;

			.name {
				margin-right: 30upx;
			}
		}
	}
</style>
